﻿@page "/panel"

@using NorthwindBlazor.Data
@using NorthwindBlazor.Models.Northwind
@using Microsoft.EntityFrameworkCore

@inject NorthwindContext dbContext

<h1 style="display:inline">Panel</h1><a style="margin-left: 10px" href="https://github.com/akorchev/blazor.radzen.com/blob/master/Pages/PanelPage.razor" target="_blank">[source code]</a>

<p>This page demonstrates <b>Panel</b> component.</p>
<RadzenCard>
    <div class="row">
        <div class="col-md-6">
            <h3>Panel</h3>
            <RadzenPanel AllowCollapse="true" Style="width:600px;margin-bottom: 20px; height:500px;"
                         Expand="@(() => Change("Panel expanded"))" Collapse="@(() => Change("Panel collapsed"))">
                <HeaderTemplate>
                    <span style="float:left;">
                        <RadzenIcon Icon="account_box" /><b style="font-size:30px">ORDER</b>
                    </span>
                </HeaderTemplate>
                <ChildContent>
                    <RadzenDataList PageSize="1" WrapItems="true" AllowPaging="true" Data="@orders" TItem="Order">
                        <Template Context="order">
                            <RadzenCard Style="width:300px;height:300px">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div>Company:</div>
                                        <b>@order.Customer?.CompanyName</b>
                                        <div style="margin-top:20px">Employee:</div>
                                        <b>@(order.Employee?.FirstName + " " + order.Employee?.LastName)</b>
                                        <br />
                                        <RadzenImage Path="@order.Employee?.Photo" Style="width:100px;" />
                                    </div>
                                    <div class="col-md-6">
                                        <div>Freight:</div>
                                        <b>@String.Format(new System.Globalization.CultureInfo("en-US"), "{0:C}", order.Freight)</b>
                                        <div style="margin-top:20px">Ship country:</div>
                                        <b>@(order.ShipCountry)</b>
                                        <div style="margin-top:20px">Ship city:</div>
                                        <b>@(order.ShipCity)</b>
                                        <div style="margin-top:20px">Ship name:</div>
                                        <b>@(order.ShipName)</b>
                                    </div>
                                </div>

                            </RadzenCard>
                        </Template>
                    </RadzenDataList>
                </ChildContent>
            </RadzenPanel>
        </div>
        <div class="col-md-6">
            <h3>Events</h3>
            <RadzenCard style="overflow: auto;height:500px;">
                @foreach (var e in events.OrderByDescending(i => i.Key))
                {
                    @e.Value
                    <br />
                }
            </RadzenCard>
        </div>
    </div>
</RadzenCard>

@code {
    IEnumerable<Order> orders;

    protected override async Task OnInitAsync()
    {
        var query = from order in dbContext.Orders
                            .Include("Customer")
                            .Include("Employee")
                            .Include("OrderDetails")
                            .Include("OrderDetails.Product")
                    select order;

        orders = await Task.FromResult(query.ToList());
    }

    Dictionary<DateTime, string> events = new Dictionary<DateTime, string>();

    void Change(string text)
    {
        events.Add(DateTime.Now, $"{text}");
        StateHasChanged();
    }
}
